/* 引入Normalize.css重置默认样式 */
@import url('https://cdn.bootcdn.net/ajax/libs/normalize/8.0.1/normalize.min.css');

/* 全局样式设置 */
* {
  box-sizing: border-box; /* 盒模型：border和padding不影响宽度计算 */
}

body {
  font-family: "Microsoft YaHei", Arial, sans-serif; /* 适配中文显示 */
  font-size: 14px;
  color: #333;
  background-color: #f5f7fa; /* 页面背景色 */
  line-height: 1.5;
  margin: 0;
  padding: 0;
}

/* 网站整体容器 - 固定宽度居中 */
.site-container {
  width: 1200px;
  margin: 0 auto;
}

/* 头部区域样式 */
.header {
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid #eee; /* 分隔头部与导航 */
}

.header-inner {
  display: flex;
  justify-content: space-between; /* 学院名称居左，校训居右 */
  align-items: center;
  width: 1200px;
  margin: 0 auto;
  padding: 20px 0;
}

.college-name h1 {
  font-size: 28px;
  color: #2c3e50; /* 主色调：深蓝色 */
  margin: 0;
}

.college-eng {
  font-size: 14px;
  color: #7f8c8d; /* 辅助色：灰色 */
  margin-top: 5px;
  letter-spacing: 1px;
}

.school-motto {
  font-size: 16px;
  color: #34495e;
  font-weight: 500;
  letter-spacing: 2px;
}

/* 导航区域样式 - Flex横向布局 */
.nav {
  width: 100%;
  background-color: #2c3e50; /* 导航栏背景色 */
}

.nav-list {
  display: flex;
  width: 1200px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.nav-list li {
  position: relative;
}

.nav-list a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 15px 25px; /* 导航项内边距 */
  font-size: 15px;
  transition: background-color 0.3s ease; /* 平滑过渡 */
}

.nav-list a:hover {
  background-color: #34495e; /* hover时深色背景 */
}

/* 主体内容区 - Flex三列布局 */
.main-content {
  display: flex;
  margin: 20px 0;
  gap: 20px; /* 列之间间距 */
}

/* 左侧侧边栏 - 固定宽度 */
.sidebar {
  width: 250px;
  flex-shrink: 0; /* 不收缩，保持固定宽度 */
}

.sidebar-module {
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05); /* 轻微阴影增强层次 */
  padding: 15px;
  margin-bottom: 20px;
}

.sidebar-module h3 {
  font-size: 16px;
  color: #2c3e50;
  margin: 0 0 15px 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #f1f1f1; /* 分隔标题与内容 */
}

.sidebar-link {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-link li {
  margin-bottom: 10px;
}

.sidebar-link a {
  color: #34495e;
  text-decoration: none;
  display: block;
  padding: 5px 0;
  transition: all 0.3s ease;
}

.sidebar-link a:hover {
  color: #3498db; /* hover时蓝色文字 */
  padding-left: 5px; /* 轻微左移，增强交互 */
}

/* 中间内容区 - 自适应宽度 */
.content {
  flex: 1; /* 占据剩余全部空间d */
}

/* 板块通用样式（新闻、通知、学术） */
.section {
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  padding: 15px;
  margin-bottom: 20px;
}

.section-header {
  display: flex;
  justify-content: space-between; /* 标题居左，更多链接居右 */
  align-items: center;
  border-bottom: 1px solid #f1f1f1;
  padding-bottom: 10px;
  margin-bottom: 15px;
}

.section-header h2 {
  font-size: 18px;
  color: #2c3e50;
  margin: 0;
  font-weight: 600;
}

.more-link {
  font-size: 14px;
  color: #3498db;
  text-decoration: none;
  transition: color 0.3s ease;
}

.more-link:hover {
  color: #2980b9;
  text-decoration: underline;
}

/* 列表通用样式 */
.item-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.item-list li {
  margin-bottom: 10px;
  line-height: 1.6;
  border-bottom: 1px dashed #f1f1f1; /* 虚线分隔列表项 */
  padding-bottom: 8px;
}

.item-list li:last-child {
  border-bottom: none; /* 最后一项无虚线 */
}

.item-list a {
  font-size: 14px;
  color: #34495e;
  text-decoration: none;
  display: block;
}

.item-list span {
  float: right;
  color: #7f8c8d;
  font-size: 13px;
}

.item-list a:hover {
  color: #3498db;
}

/* 右侧信息区 - 固定宽度 */
.right-info {
  width: 280px;
  flex-shrink: 0; /* 不收缩 */
}

/* 图片展示区样式 */
.img-box {
  width: 100%;
  height: auto;
  border-radius: 4px;
  overflow: hidden; /* 裁剪图片圆角 */
  margin-bottom: 15px;
}

.img-box img {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.img-box img:hover {
  transform: scale(1.02); /* hover时轻微放大 */
}

/* 底部区域样式 */
.footer {
  width: 100%;
  background-color: #2c3e50;
  color: #bdc3c7; /* 浅色文字 */
  text-align: center;
  padding: 20px 0;
  margin-top: 30px;
}

.footer p {
  margin: 5px 0;
  font-size: 13px;
}

/* 列表页专属样式 */
.list-header {
  background-color: #fff;
  padding: 15px;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  margin-bottom: 20px;
}

.list-header h1 {
  font-size: 22px;
  color: #2c3e50;
  margin: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #f1f1f1;
}

.pagination {
  text-align: center;
  margin: 30px 0;
}

.pagination a {
  display: inline-block;
  padding: 8px 15px;
  margin: 0 5px;
  background-color: #fff;
  color: #34495e;
  text-decoration: none;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.pagination a.active {
  background-color: #3498db;
  color: #fff;
}

.pagination a:hover:not(.active) {
  background-color: #f5f7fa;
}

/* 详情页专属样式 */
.detail-header {
  background-color: #fff;
  padding: 20px;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  margin-bottom: 20px;
  text-align: center;
}

.detail-header h1 {
  font-size: 24px;
  color: #2c3e50;
  margin: 0 0 15px 0;
}

.detail-meta {
  font-size: 13px;
  color: #7f8c8d;
  margin-bottom: 15px;
  border-top: 1px solid #f1f1f1;
  border-bottom: 1px solid #f1f1f1;
  padding: 10px 0;
}

.detail-content {
  background-color: #fff;
  padding: 20px;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  line-height: 1.8;
  font-size: 15px;
  color: #34495e;
}

.detail-content p {
  margin: 15px 0;
}

.back-link {
  display: inline-block;
  margin: 20px 0;
  padding: 8px 15px;
  background-color: #3498db;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}

.back-link:hover {
  background-color: #2980b9;
}